<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>books</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
          integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
    <style>
        .container {
            margin-top: 100px;
        }

    </style>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-6 col-md-offset-3">
        <h3><a href="{% url 'app01:addbook' %}"  class="pull-right btn btn-info">添加书籍</a></h3>
            <br> <br>
            <table class="table table-striped table-bordered">
                <thead>
                <tr style="font-weight:bolder;">
                    <td>书籍名称</td>
                    <td>价格</td>
                    <td>出版时间</td>
                    <td>出版社</td>
                    <td>编辑操作</td>
                    <td>删除操作</td>
                </tr>
                </thead>
                <tbody>

                {% for book in books %}
                    <tr>
                        <td>{{ book.title }}</td>
                        <td>{{ book.price }}</td>
                        <td>{{ book.pub_date|date:'Y-m-d' }}</td>
                        <td>{{ book.press }}</td>
                        <td><a href="http://127.0.0.1:8000/app01/{{ book.id }}/change" class="btn btn-info">编辑</a></td>
                         <td><a href="http://127.0.0.1:8000/app01/{{ book.id }}/delete" class="btn btn-danger">删除</a></td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
</html>